<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui" template="ui.xhtml">

	<ui:define name="head">
		<style type="text/css">
.ui-confirm-dialog-severity {
	margin: 0 7px 7px 0;
}
</style>
	</ui:define>
	<ui:define name="content">
		<p:panel header="#{msg.label_applicationusers}" id="panel">
			<h:form>
				<p:commandButton value="#{msg.label_newuser}"
					onclick="dlgNew.show()" icon="add" />
			</h:form>
			<!-- Formulario nuevo usuario -->
			<h:form id="frmNew">
				<p:dialog header="#{msg.label_newuser}" widgetVar="dlgNew"
					resizable="false" modal="true" id="newDialog">
					<p:growl id="newGrowl" showDetail="false" sticky="true" />
					<h:panelGrid columns="2" style="margin-bottom:10px; width: 400px;"
						cellpadding="" id="matchGrid">
						<h:outputLabel for="name" value="#{msg.label_name}: " />
						<p:inputText id="name" required="true" size="30"
							value="#{UserBean.name}" />
						<h:outputLabel for="lastname" value="#{msg.label_lastname}: " />
						<p:inputText id="lastname" required="true" size="30"
							value="#{UserBean.lastname}" />
						<h:outputLabel for="maidenname" value="#{msg.label_maidenname}: " />
						<p:inputText id="maidenname" size="30"
							value="#{UserBean.maidenname}" />
						<h:outputLabel for="user" value="#{msg.label_user}: " />
						<p:inputText id="user" size="30" required="true"
							value="#{UserBean.username}" />
						<h:outputLabel for="pwd1" value="#{msg.label_password}: *" />
						<p:password id="pwd1" match="pwd2" label="Password 1"
							required="true" feedback="true" value="#{UserBean.password}" />
						<h:outputLabel for="pwd2" value="#{msg.label_confirmpassword}: *" />
						<p:password id="pwd2" label="Password 2" required="true"
							value="#{UserBean.password}" />
						<h:outputLabel for="mail" value="#{msg.label_email}: " />
						<p:inputText id="mail" size="30" validatorMessage="Email invalido"
							required="true" value="#{UserBean.mail}">
							<f:validateRegex pattern="[a-zA-Z0-9]+@[a-zA-Z]+.[a-zA-Z]{2,3}"></f:validateRegex>
						</p:inputText>
						<f:facet name="footer">
							<p:commandButton id="submitButton" value="#{msg.label_save}"
								icon="save" actionListener="#{UserBean.save}"
								oncomplete="dlgNew.hide();"
								update=":frmlist,newGrowl,newDialog matchGrid" />
							<p:commandButton value="#{msg.label_cancel}"
								oncomplete="dlgNew.hide();" icon="cancel" />
						</f:facet>
					</h:panelGrid>
				</p:dialog>
			</h:form>
			<br />
			<!-- Formulario lista de usuarios -->
			<h:form id="frmlist">
				<p:dataTable var="user" value="#{UserBean.listUser}" id="dataTable"
					widgetVar="userTable" emptyMessage="#{msg.label_registernotfound}."
					filteredValue="#{UserBean.filteredUser}" paginator="true" rows="10"
					paginatorPosition="bottom"
					paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
					rowsPerPageTemplate="1,5,10,15,20,30">
					<f:facet name="header">
						<p:outputPanel>
							<h:outputText value="#{msg.label_anycolumn}:" />
							<p:inputText id="globalFilter" onkeyup="userTable.filter()"
								style="width:150px" />
						</p:outputPanel>
					</f:facet>
					<h:inputHidden value="#{user.id}" />
					<p:column id="name" filterBy="#{user.name}"
						headerText="#{msg.label_name}" filterMatchMode="contains">
						<h:outputText value="#{user.name}" />
					</p:column>
					<p:column id="lastname" filterBy="#{user.lastname}"
						headerText="#{msg.label_lastname}" filterMatchMode="contains">
						<h:outputText value="#{user.lastname}" />
					</p:column>
					<p:column id="maidenname" filterBy="#{user.maidenname}"
						headerText="#{msg.label_maidenname}" filterMatchMode="contains">
						<h:outputText value="#{user.maidenname}" />
					</p:column>
					<p:column id="username" filterBy="#{user.username}"
						headerText="#{msg.label_user}" filterMatchMode="contains">
						<h:outputText value="#{user.username}" />
					</p:column>
					<p:column id="mail" filterBy="#{user.mail}"
						headerText="#{msg.label_email}" filterMatchMode="contains">
						<h:outputText value="#{user.mail}" />
					</p:column>
					<p:column style="width:12%; text-align: center;">
						<p:commandButton oncomplete="editDialog.show()" icon="edit"
							title="#{msg.label_edit}" update=":frmEdit"
							actionListener="#{UserBean.prepareUser(user.id)}" />
						<p:commandButton icon="delete" title="#{msg.label_edit}"
							actionListener="#{UserBean.prepareUser(user.id)}"
							onclick="confirmation.show()" />
					</p:column>
				</p:dataTable>
			</h:form>
			<!-- Formulario para editar usuario -->
			<h:form id="frmEdit">
				<p:dialog header="#{msg.label_edit}" widgetVar="editDialog"
					resizable="false" modal="true" id="editDialog">
					<p:growl id="editGrowl" showDetail="false" sticky="true" />
					<h:panelGrid columns="2" style="margin-bottom:10px; width: 400px;">
						<h:outputLabel for="name" value="#{msg.label_name}: " />
						<p:inputText id="name" required="true" size="30"
							value="#{UserBean.user.name}" />
						<h:outputLabel for="lastname" value="#{msg.label_lastname}: " />
						<p:inputText id="lastname" required="true" size="30"
							value="#{UserBean.user.lastname}" />
						<h:outputLabel for="maidenname" value="#{msg.label_maidenname}: " />
						<p:inputText id="maidenname" size="30"
							value="#{UserBean.user.maidenname}" />
						<h:outputLabel for="user" value="#{msg.label_user}: " />
						<p:inputText id="user" size="30" required="true"
							value="#{UserBean.user.username}" />
						<h:outputLabel for="mail" value="#{msg.label_email}: " />
						<p:inputText id="mail" size="30" validatorMessage="Email invalido"
							required="true" value="#{UserBean.user.mail}">
							<f:validateRegex pattern="[a-zA-Z0-9]+@[a-zA-Z]+.[a-zA-Z]{2,3}"></f:validateRegex>
						</p:inputText>
						<f:facet name="footer">
							<p:commandButton value="#{msg.label_save}" icon="save"
								actionListener="#{UserBean.edit()}"
								oncomplete="editDialog.hide();" update=":frmlist,editGrowl" />
							<p:commandButton value="#{msg.label_cancel}"
								oncomplete="editDialog.hide();" icon="cancel" />
						</f:facet>
					</h:panelGrid>
				</p:dialog>
			</h:form>
			<!-- Formulario para eliminar usuario -->
			<h:form prependId="false">
				<p:growl id="deleteGlow" />
				<p:confirmDialog id="confirmDialog"
					message="#{msg.label_confirmdltuser}"
					header="#{msg.label_confirmdltuser}" severity="alert"
					widgetVar="confirmation">
					<p:commandButton id="confirm" update=":frmlist,deleteGlow"
						value="#{msg.label_yes}" oncomplete="confirmation.hide()"
						actionListener="#{UserBean.delete()}" icon="accept" />
					<p:commandButton id="decline" value="#{msg.label_no}"
						onclick="confirmation.hide()" type="button" icon="cancel" />
				</p:confirmDialog>
			</h:form>
			<!-- Formulario de sesion -->
			<h:form>
				<p:growl id="msg" showDetail="true" sticky="true" />
				<!-- If idle 10 seconds, run 'idleDialog' -->
				<p:idleMonitor timeout="1700000" onidle="idleDialog.show()" />
				<p:confirmDialog id="confirmDialog"
					message="#{msg.label_confirmationendsession}"
					header="#{msg.label_expiredsession}" severity="alert"
					widgetVar="idleDialog">
					<p:commandButton id="confirm" value="#{msg.button_submit}"
						update=":panel" oncomplete="idleDialog.hide()"
						onclick="window.location='#{facesContext.externalContext.requestContextPath}/login.xhtml';" />
				</p:confirmDialog>
			</h:form>
		</p:panel>
		<p:confirmDialog header="Oooops!!!" severity="alert"
			visible="#{not empty param['expired']}" message="View has expired."
			widgetVar="confirmDlg">
			<p:commandButton type="button" value="OK" onclick="confirmDlg.hide()" />
		</p:confirmDialog>
	</ui:define>
</ui:composition>